@charset "utf-8";
$font-size:12;/**********变量元素*********/
@function bgg($px){/************函数样式************/
    @return $px/$font-size*(640/640)*1rem;
}
html{/**************html根字体大小**************/
    font-size: $font-size*1px;
}
/***********这里是页面*********/
.web{
    width: 100%;
    height: 100%;
    margin: 0 auto;
    header{/*********这里是头部样式*********/
        top: 0;
        left: 0;
        width: 100%;
        height: bgg(89);
        position: fixed;
        z-index: +2;
        img{
            display: block;
            width: 100%;
            height: 100%;
//          float: left;
        }
        .xian{
            position: absolute;
            left: bgg(23);
            top: bgg(32);
//          display: inline-block;
            .xian_1{
                border: bgg(2) solid #ffffff;
                width: bgg(30);
                margin-bottom: bgg(6);
//              display: inline-block;
            }
            .xian_2{
                border: bgg(2) solid #ffffff;
                width: bgg(30);
                margin-bottom: bgg(6);
//              display: inline-block;
            }
            .xian_3{
                border: bgg(2) solid #ffffff;
                width: bgg(30);
//              display: inline-block;
            }
        }
        .dian_1{
            width: bgg(26);
            height: bgg(26);
            border-radius: bgg(26);
            background: #ff0000;
            position: absolute;
            left: bgg(50);
            top: bgg(14);
            line-height: bgg(26);
            text-align: center;
            span{
                font-size: bgg(16.21);
                color: #ffffff;
            }
        }
        .quan{
            border: bgg(3) solid white;
            width: bgg(44);
            height: bgg(44);
            border-radius: 50%;
            position: absolute;
            top: bgg(19);
            right: bgg(17);
            text-align: center;
//          vertical-align: middle;
            .sousuo{
                font-size: bgg(35);
//              vertical-align: middle;
                line-height: 100%;
                color: white;
            }
        }
    }
    section{/***********内容样式***********/
        width: 100%;
        margin-top: bgg(95);
        margin-bottom: bgg(95);
        .lunbo{
            display: block;
            width: 100%;
            height: bgg(342);
//          margin-top: bgg(95);
            position: relative;
//          top: bgg(95);
            img{
                display: block;
                width: 100%;
                height: bgg(342);
            }
            .opacity{
                position: absolute;
                bottom: 0;
                left: 0;
                content: "";
                z-index: +1;
                width: 100%;
                height: bgg(105);
                background: rgba(0,0,0,0.3);
                .opacity_1{
                    color: #ffffff;
                    background: #b20000;
                    font-size: bgg(26.79);
                    width: bgg(180);
                    height: bgg(38);
//                  line-height: bgg(38);
                    margin-top: bgg(19);
                    margin-left: bgg(27);
                    display: inline-block;
                    position: relative;
                    text-align: center;
                }
                .opacity_1~span{
                    font-size: bgg(26.79);
                    color: #ffffff;
//                  line-height: bgg(38);
                }
                .dian{
//                  display: inline-block;
//                  margin: 0 auto;
                    .dian_1{
                        border: bgg(1) solid #b20000;
                        background: #b20000;
                        width: bgg(8);
                        height: bgg(8);
                        border-radius: bgg(8);
                        position: absolute;
                        z-index: +1;
                        left: bgg(252);
                        top: bgg(20);
    //                      margin: 0 auto;
//                      display: inline-block;
                    }
                    .dian_2{
                        border: bgg(1) solid #ffffff;
                        background: #ffffff;
                        width: bgg(8);
                        height: bgg(8);
                        border-radius: bgg(8);
                        position: absolute;
                        z-index: +1;
                        left: bgg(286);
                        top: bgg(20);
//                      margin-right: bgg(21);
    //                      margin: 0 auto;
//                      display: inline-block;
                    }
                    .dian_3{
                        border: bgg(1) solid #ffffff;
                        background: #ffffff;
                        width: bgg(8);
                        height: bgg(8);
                        border-radius: bgg(8);
                        position: absolute;
                        z-index: +1;
                        left: bgg(321);
                        top: bgg(20);
//                      margin-right: bgg(21);
                    } 
                }
            }
        }
        .series{
            width: 91.10%;
            height: 100%;
            margin: 0 auto;
            display: inline-block;
            margin-top: bgg(18);
            margin-left: bgg(28);
            .wanghan{
                width: bgg(282);
                height: bgg(343);
                background: #f6f6f6;
                margin-bottom: 20px;
                .wanghan>img{
                    width: 100%;
                    height: bgg(182);
                }
                p{
                    color: #010101;
                    font-size: bgg(22);
                    padding: 0 bgg(7);
                    text-align: justify;
                    margin-top: bgg(13);
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                }
                .wanghan_1{
                    position: relative;
                    a{
                        display: inline-block;
                        width: bgg(88);
                        height: bgg(27);
                        border: bgg(1) solid #b20000;
                        background: #b20000;
                        border-radius: bgg(5);
                        color: #ffffff;
                        font-size: bgg(18);
                        text-align: center;
                        line-height: bgg(27);
                        margin-left: bgg(7);
                        margin-top: bgg(12);
                    }
                    .aixin{
                        font-size: bgg(40);
                        color: #c5c5c5;
                        position: absolute;
                        left: bgg(120);
                        top: 0;
                    }
                    .aixin+span{
                        color: #c5c5c5;
                        font-size: bgg(20);
                        margin-left: bgg(60);
                    }
                    .yan{
                        font-size: bgg(30);
                        color: #c5c5c5;
                        position: absolute;
                        right: bgg(45);
                        top: bgg(10);
                    }
                    .yan+span{
                        color: #c5c5c5;
                        font-size: bgg(20);
                        margin-left: bgg(40);
                    }
                }
                .wanghan_2{
                    
                    img{
                        width: bgg(34);
                        height: bgg(35);
                        background: #dedede;
                        margin-left: bgg(7);
                        margin-top: bgg(6);
                        float: left;
                    }
                    .mingzi{
                        color: #c5c5c5;
                        font-size: bgg(18);
                        width: bgg(74);
                        float: left;
                        margin-top: bgg(11);
                        margin-left: bgg(8);
                    }
                    .mingzi+span{
                        color: #c5c5c5;
                        font-size: bgg(18);
                        float: left;
                        margin-top: bgg(11);
                    }
                }
            }
            .sp_xian{
                border: bgg(1) solid #e4e4e4;
                width: 100%;
                margin-top: bgg(8);
                margin-bottom: bgg(20);
                display: block;
            }
            .lianjie{
                text-align: center;
                
                a{
                    color: #bbbbbb;
                    font-size: bgg(22);
                    
                    margin-bottom: bgg(31);
                    text-decoration: none;
                    display: inline-block;
                }
            }
        }
    }
    footer{/***********尾部样式***************/
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        height: bgg(95);
        background: #f5f5f5;
        border-top: bgg(2) solid #cccbcb;
        .foot{
            display: inline-block;
//          vertical-align: middle;
            .home_page{
                text-align: center;
                margin: 0 auto;
                width: bgg(128);
                height: bgg(95);
                display: inline-block;
                a{
                    text-decoration: none;
                    display: inline-block;
                    width: 100%;
                    height: 100%;
                    .a{
                        width: 100%;
                        height: 100%;
                        display: inline-block;
                        margin: bgg(23) auto;
                        line-height: bgg(25);
                        .wuzi{
                            display: inline-block;
                            margin: 0 auto;
                            font-size: bgg(41);
                            width: 100%;
//                          height: bgg(38);
                            color: #8b8b8b;
                        }
                        p{
                            color: #8b8b8b;
                            font-size: bgg(20);
                        }
                    }
                }
            }
            .gimc{
                a{
                    .a{
                        img{
                            width: bgg(50);
                            height: bgg(35);
                            margin: bgg(-5) auto;
                            margin-bottom: bgg(-2);
                        }
                    }
                }
            }
            .article{
                a{
                    .a{
                        img{
                            width: bgg(40);
                            height: bgg(35);
                            margin: bgg(-7) auto;
                            margin-bottom: bgg(-2);
                        }
                        p{
                            color: #b60207;
                        }
                    }
                }
            }
            .resource{
                a{
                    .a{
                        .ziyuan{
                            font-size: bgg(40);
                            margin: bgg(-3) auto;
                            font-weight: bold;
                        }
                    }
                }
            }
            .college{
                a{
                    .a{
                        img{
                            width: bgg(63);
                            height: bgg(32);
                            margin: bgg(-7) auto;
                            margin-bottom: bgg(-2);
                        }
                    }
                }
            }
        }
    }
}
